<template>
  <div class="box">
    <van-nav-bar
        title="标题"
        left-arrow
        @click-left="onClickLeft"
    />
    <div class="point">
      <div class="left" @click="goto">
        <span><img src="../../../../../public/img/名校套卷.png"></span>
        <span>题库练习</span>
      </div>
      <div @click="edit"><img src="../../../../../public/img/4.png"></div>
    </div>

      <van-action-sheet v-model="show" title="考点专练设置">
        <div class="content">
            <p class="edits">设置考点专练出题</p>
          <div class="check">
            <div><input type="radio" class="ck" name="ck">随机15道</div>
            <div><input type="radio" class="ck" name="ck">按顺序做题 </div>
          </div>
          <button class="ok">确定</button>
        </div>
      </van-action-sheet>
  </div>
</template>

<script>
export default {
  data(){
    return{
        show:false
    }
  },
  mounted() {

  },
  methods: {
    onClickLeft() {
      this.$router.push('/Practice')
    },
    goto(){
      this.$router.push('/point')
    },
    edit(){
        this.show=true
    }
  },
}
</script>

<style scoped lang="scss">
.box{
  background-color:#F0F2F5;
  height: 100vh;
  width: 100%;
}
.point{
  margin-top: 10px;
  width: 100%;
  height: 30px;
  display: flex;
  background-color: #fff;
  align-items: center;
  justify-content: space-between;
  box-sizing:border-box;
  padding: 10px;
  font-size: 15px;
  .left{
    width: 80px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: space-around;
  }
  img{
    width: 15px;
  }
}
.content {
  border-top: 1px solid grey;
  padding: 15px 5px 5px;
}
.edits{
  width: 100%;
  font-size: 16px;
  color: #8c8c8c;
}
.check{
  width: 100%;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  border-bottom: 1px solid #999999;
  font-size: 15px;
}
.ok{
  width: 100%;
  height: 50px;
  background-color: #EB6100;
  color: #fff;
  text-align: center;
  line-height: 50px;
  border: 0px;
}
</style>